// 产品展示页面互相跳转的data 默认加载

// 获取URL字符串函数
function getQueryParam(str) {
    // console.log(window.location.search); => success => ?data=1
    var regex = new RegExp('[\\?&]' + str + '=([^&#]*)', 'i');
    var result = regex.exec(window.location.search);
    return result ? decodeURIComponent(result[1].replace(/\+/g, '')) : null;
}

// 排他函数
function expect(arr) {
    for (let i = 0; i < arr.length; i++) {
        arr[i].classList.remove('cur');
    }
}

// 切换页面时的默认数据渲染
var dataId = getQueryParam('data');
// console.log(dataId); => success
// console.log(dataId);
// console.log(datas[dataId]); => success
// console.log(datas[dataId].length);

if (dataId === null) {
    // 首次进入页面 没有查询url 直接渲染第一个数据
    for (let i = 0; i < data1.length; i++) {
        products.innerHTML += `<div class="product">
                                    <div class="pic">
                                        <img src="${data1[i].image}" />
                                    </div>
                                    <a href="#">
                                        <div class="desc">
                                            ${data1[i].name}
                                        </div>
                                    </a>
                                </div>`;
    }
    var num = data1.length;
    if (num > 6) {
        page.innerHTML += `<div id="page1" class="w cur">1</div>
                           <div id="page2" class="w">2</div>`;
    } else {
        page.innerHTML += `<div class="w cur">1</div>`;
    }
    pageTotal.innerHTML = `共${num}条`;
} else {
    // 有查询url
    var lens;
    if (datas[dataId].length > 6) {
        lens = 6;
    } else {
        lens = datas[dataId].length;
    }

    for (let i = 0; i < lens; i++) {
        products.innerHTML += `<div class="product">
                                    <div class="pic">
                                        <img src="${datas[dataId][i].image}" />
                                    </div>
                                    <a href="#">
                                        <div class="desc">
                                            ${datas[dataId][i].name}
                                        </div>
                                    </a>
                                </div>`;
    }

    if (datas[dataId].length > 6) {
        page.innerHTML += `<div id="page1" class="w cur">1</div>
                            <div id="page2" class="w">2</div>`;
    } else {
        page.innerHTML += `<div class="w cur">1</div>`;
    }

    pageTotal.innerHTML = `共${datas[dataId].length}条`;

    // 选中tab栏的切换
    var productTabs = document.getElementById('productTabs');
    var index = dataId.slice(5, 6) - 1;
    // console.log(index);
    // console.log(productTabs.children); => array

    var tabs = productTabs.children;
    expect(tabs);
    tabs[index].classList.add('cur');
}
